<!DOCTYPE html>
<html lang="en">
	<head>
		<link rel="icon" type="image/png" href="img/logo/favicon128.png">
		<meta http-equiv=Content-Type content="text/html;charset=utf-8">
		<!-- 要用到的CSS -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<link href="css/bootstrap.css" rel="stylesheet">
		<link href="css/prettify.css" rel="stylesheet">

		<!-- 我的自定义CSS -->
		<link href="css/cdoj.css" rel="stylesheet">

		<!-- 要用到的JS -->
		<script src="js/jquery.min.js"></script>
		<script src="js/bootstrap.js"></script>
		<script src="js/prettify.js"></script>
		<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
		<!-- 如果需要开启内网模式的话请解压MathJax.zip到plugin目录下然后将上面替换成这个
		<script type="text/javascript" src="plugin/MathJax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
		-->
		<script src="plugin/ckeditor/ckeditor.js"></script>
		<script src="plugin/edit_area/edit_area_full.js"></script>

		<script src="js/cdoj.js"></script>

		<!-- 网站标题，暂时先这样 -->
		<title>${position} - UESTC Online Judge</title>

	</head>

	<body>
		<!-- 
		Navbar 
		@TODO:
		决定导航上的项目有哪些
		分隔符的颜色需要微调
		Navbar都要用
		-->
		<div class="navbar navbar-fixed-top">
			<div class="navbar-inner">
				<div class="container">
					<!-- 留白。。。 -->
					<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</a><!-- 留白。。。 -->

					<!-- 导航部分 -->
					<ul class="nav">
						<!-- 当前页面class为active -->
						<li class="active">
						<a href="./index.html#">CDOJ</a>
						</li>
						<li class="divider-vertical"></li>

						<li>
						<a href="./problem.html">Problems</a>
						</li>
						<li class="divider-vertical"></li>

						<li>
						<a href="./contest.html">Contests</a>
						</li>
						<li class="divider-vertical"></li>

						<li>
						<a href="./statu.html">Status</a>
						</li>
						<li class="divider-vertical"></li>

						<li>
						<a href="./ranklist.html">Ranklist</a>
						</li>
						<li class="divider-vertical"></li>

						<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">Links<b class="caret"></b></a>
						<ul class="dropdown-menu">
							<!-- 固定链接 -->
							<li><a href="#">BBS</a></li>
							<li><a href="#">Wiki</a></li>
							<li><a href="http://www.mzry1992.com/blog/">mzry1992.com</a></li>

							<!-- Click这里就交给何老师了 -->
							<li class="divider"></li>
							<li class="nav-header">Click</li>
							<li><a href="#">F.A.Q</a></li>
							<li><a href="#">Download</a></li>
							<li><a href="#">Step-by-Step</a></li>
							<li><a href="#">Team Honors</a></li>

						</ul>
						</li>
						<li class="divider-vertical"></li>

					</ul><!-- 导航部分 -->

					<!-- 快速搜索框 -->
					<form class="navbar-search pull-right" action="">
						<input type="text" class="search-query span2" placeholder="Search">
					</form>

					<!-- 用户信息菜单，自行取用 -->
					<!-- 
					用户信息菜单，登陆后
					-->
					<ul class="nav pull-right">
						<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
							<i class="icon-user"></i>
							${user.name}
							<b class="caret"></b>
						</a>
						<ul class="dropdown-menu">
							<!-- 用户中心的入口 -->
							<li>
							<a href="./usercenter.html">
								<i class="icon-home"></i>
								User center
							</a>
							</li>

							<!-- 未读消息 -->
							<li>
							<a href="./message.html">
								<i class="icon-envelope"></i>
								Message
								<span class="badge badge-success">2</span>
							</a>
							</li>

							<!-- 收藏夹 -->
							<li>
							<a href="./bookmark.html">
								<i class="icon-folder-open"></i>
								Bookmark
							</a>
							</li>

							<!-- 登出 -->
							<li>
							<a href="./logout.html">
								<i class="icon-off"></i>
								Logout
							</a>
							</li>
						</ul>
						</li>
					</ul><!-- 用户相关的菜单 -->

					<!-- 
					用户信息菜单，没有登录的时候
					-->
					<ul class="nav pull-right">
						<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
							<i class="icon-pencil"></i>
							Login
							<b class="caret"></b>
						</a>
						<ul class="dropdown-menu">
							<!-- 登陆按钮 -->
							<li>
							<a href="./login.html">
								<i class="icon-ok-circle"></i>
								Login
							</a>
							</li>

							<!-- 注册按钮 -->
							<li>
							<a href="./register.html">
								<i class="icon-plus-sign"></i>
								Register
							</a>
							</li>

						</ul>
						</li>
					</ul><!-- 用户相关的菜单 -->

				</div>
			</div>
		</div><!-- navbar -->

		<!-- 正文 -->
		<div id="wrap">
			<div class="container">
				<!-- 这一部分保留给NOTICE信息 -->
				<div class="row">
					<div class="span12">
						<div class="alert alert-block">
							<div class="row">
								<div class="span1">
									<h4 class="alert-heading">Notice</h4>
								</div>
								<div class="span10">
									<marquee class="notice" onmouseover="javascript:this.stop();" onmouseout="javascript:this.start()">
									<!-- 新消息 -->
									<span class="label label-important">new</span>
									<a href="#">趣味赛第五场（正式赛）比赛推迟(2012-12-15 13:06:00)</a>
									&nbsp;&nbsp;&nbsp;&nbsp;

									<!-- 旧消息 -->
									<a href="#">趣味赛正式赛时间和机房开放的通知(2012-09-14 12:30:42)</a>
									&nbsp;&nbsp;&nbsp;&nbsp;

									<a href="#">趣味赛正式赛时间和机房开放的通知(2012-09-14 12:30:42)</a>
									&nbsp;&nbsp;&nbsp;&nbsp;

									<a href="#">趣味赛正式赛时间和机房开放的通知(2012-09-14 12:30:42)</a>
									&nbsp;&nbsp;&nbsp;&nbsp;

									</marquee>
								</div>
							</div>
						</div>
					</div>
				</div><!-- NOTICE -->



				<div id="activityCarousel" class="carousel slide">
					<!-- Carousel items -->
					<div class="carousel-inner">
						<div class="item active">
							<img src="img/test/test001.png">
							<div class="carousel-caption">
								<h4>趣味赛</h4>
								<p>这里可以写一些小介绍之类的东西。要注意图片大小必须严格是1170*450。做海报的时候可以顺便做了</p>
							</div>
						</div>

						<div class="item">
							<img src="img/test/test002.png">
							<div class="carousel-caption">
								<h4>四维较量</h4>
								<p>想想数据库和后台怎么维护吧</p>
							</div>
						</div>

					</div>
					<!-- Carousel nav -->
					<a class="carousel-control left" href="#activityCarousel" data-slide="prev">&lsaquo;</a>
					<a class="carousel-control right" href="#activityCarousel" data-slide="next">&rsaquo;</a>
				</div>

				<div class="row">
					<div class="span12">
						<div class="hero-unit">
							<h2>UESTC Online Judge</h2>
							<div>
								<ul id="tab" class="nav nav-pills">
									<li class="active"><a href="#tab-todo-list" data-toggle="tab">TODO</a></li>
									<li class=""><a href="#tab-test" data-toggle="tab">测试</a></li>
									<li class=""><a href="#tab-test-prettify" data-toggle="tab">代码高亮</a></li>
									<li class=""><a href="#tab-test-mathjax" data-toggle="tab">公式测试</a></li>
								</ul>
								<div id="TabContent" class="tab-content">
									<div class="tab-pane fade active in" id="tab-todo-list">
										<p>
										现在缺的东西：
										<br />
										网站背景可以有。
										<br />
										logo和favicon和banner都是随手乱做的。。求大神做个好看的。。
										<br />
										页面的最小宽度需要仔细考虑，现在暂时设置为940px
										<br />
										主页slide展示的图片为1170*450，或则和其宽高比例一样的图片！最小宽度不能小于1028！（这个只是暂时的规定，后面可以修改，但是一定要保证图片的宽高比例都一样，不然效果会很呵呵的）。
										<br />
										favicon的大小是128*128的png，当然，其它尺寸也可以备几个。
										banner的大小是234*60。
										logo的大小是88*31
										<br />
										公式的话现在已经能正常使用了。
										<br />
										平时的话用CDN的mathjax.js吧，内网的时候再到本地架。
										<br />
										哦，对文档需要转义么？公式里面可能用到大于小于号呢。不过代码是必须要转的了！可以看看CF是怎么处理的！
										</p>
									</div>
									<div class="tab-pane fade" id="tab-test">
										<p>
										这里可以用作介绍。
										<br/>
										小朋友们大家好，还记得我是谁吗？
										<br/>
										对了，我就是葛炮！
										</p>
										<p><a class="btn btn-primary btn-large" href="#">More »</a></p>
									</div>
									<div class="tab-pane fade" id="tab-test-prettify">	
										<p>注意，后台需要对其先转义，然后注意&lt;/pre&gt;的位置</p>
										<p>TODO:代码全选功能</p>
										<h4>C</h4>
										<pre class="prettyprint linenums">
#include &lt;stdio.h&gt;
int main()
{
	int a, b;
	scanf("%d %d",&a, &b);
	printf("%d", a+b);
	return 0;
}</pre>
<h4>C++</h4>
										<pre class="prettyprint linenums">
#include  &lt;iostream&gt;
using namespace std;
int main()
{
	int a,b;
	cin &gt;&gt; a &gt;&gt; b;
	cout &lt;&lt; a+b &lt;&lt; endl;
	return 0;
}</pre>
<h4>java</h4>
										<pre class="prettyprint linenums">
import java.io.*;
import java.util.*;
public class Main
{
	public static void main(String[] args) throws Exception
	{
		Scanner cin=new Scanner(System.in);
		int a=cin.nextInt(), b=cin.nextInt();
		System.out.println (a + b);
	}
}</pre>
									</div>

									<div class="tab-pane fade" id="tab-test-mathjax">
									</div>

								</div>
							</div>
						</div>
					</div>
				</div>

				<div class="row">
					<div class="span8">
						<h2>Contests
							<p class="pull-right"><a class="btn btn-primary" href="./contest.html">More »</a></p>
						</h2>

						<table class="table table-striped table-bordered">
							<tbody>
								<tr>
									<td>2012英才院赛</td>
									<td class="info-time">2012-12-18 20:00:00</td>
									<td class="info-contest-state"><span class="label label-info">pending</span></td>
								</tr>
								<tr>
									<td>微固学院&计算机学院兴趣小组每周一练（2）</td>
									<td class="info-time">2012-12-18 20:00:00</td>
									<td class="info-contest-state"><span class="label label-important">running</span></td>
								</tr>
								<tr>
									<td>第四届ACM趣味程序设计竞赛第二场（热身赛，陈题）</td>
									<td class="info-time">2012-12-18 20:00:00</td>
									<td class="info-contest-state"><span class="label label-success">ended</span></td>
								</tr>
							</tbody>
						</table>
					</div>
					<div class="span4">
						<h2>Problems
							<p class="pull-right"><a class="btn btn-primary" href="./problem.html">More »</a></p>
						</h2>

						<table class="table table-striped table-bordered">
							<tbody>
								<tr>
									<td>A+B Problem</td>
									<td class="info-problem-difficulty"><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i></td>
								</tr>
								<tr>
									<td>扫雷</td>
									<td class="info-problem-difficulty"><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star-empty"></i></td>
								</tr>
								<tr>
									<td>One million ways to make love</td>
									<td class="info-problem-difficulty"><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star"></i><i class="icon-star-empty"></i></td>
								</tr>
							</tbody>
						</table>

						<!-- 快速跳转题目 -->
						<form class="form-horizontal">
							<input type="text" class="span3" placeholder="Problem ID...">
							<button type="submit" class="btn btn-primary">GO!</button>
						</form>

					</div>

				</div>

				
</div>
		</div>

		<!-- Footer -->
		<div id="footer">
			<div class="container">
				<div class="row">
					<div class="span3 pull-left">
						<a id="logo-banner" href="./index.html"></a>
					</div>
					<div class="span9">
						<p class="muted credit">
						UESTC Online Judge
						</p>
						<p class="muted credit">
						Gnomovision version 69, Copyright (C) 2012 lyhypacm, mzry1992
						<br/>
						Gnomovision comes with ABSOLUTELY NO WARRANTY
						<br/>
						This is free software, and you are welcome to redistribute it under <a href="http://www.gnu.org/licenses/old-licenses/gpl-2.0.txt">certain conditions</a>
						</p>
					</div>
				</div>
			</div>
		</div>	

	</body>
</html>

